import React, { Component, createRef } from "react";
// createRef它是一个函数

// 非受控组件就是让react自己去控制的组件

class App extends Component {
  // constructor() {
  //   super();
  //   // createRef的执行结果是地址的引用
  //   this.ipt = createRef();
  // }

  ipt = createRef();
  ipt2 = createRef();

  handleClick() {
    // this.ipt.current就是input的dom元素
    console.log(this.ipt.current.value);
    console.log(this.ipt2.current.value);
  }

  render() {
    return (
      <>
        <h3>非受控组件</h3>
        {/* ref={this.ipt}表示将input标签指向了那个地址的引用 */}
        {/* 非受控组件的默认值要使用defaultValue */}
        <input type="text" ref={this.ipt} defaultValue="abc" />
        <input type="text" ref={this.ipt2} placeholder="1234" />
        <button onClick={this.handleClick.bind(this)}>btn</button>
      </>
    );
  }
}

export default App;
